<template>
  <div class="app-container">
    <el-card>
      <el-row :gutter="10" style="margin-bottom: 6px">
        <el-col :span="24" class="card-box">
            <el-form ref="queryForm" :model="form" label-width="100px" :inline="true">
              <el-form-item label="身份证号" margin-left="50px" prop="idCard">
                <el-input v-model="form.idCard" placeholder="请输入患者身份证号" style="width: 500px"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">加载患者信息</el-button>
              </el-form-item>
            </el-form>
        </el-col>
      </el-row>
    </el-card>

    <!--患者信息开始-->
    <el-row :gutter="12" style="margin-bottom: 6px">
      <el-col :span="24" class="card-box">
        <el-card>
          <el-form ref="form" :model="form" label-width="100px" :inline="true">
            <el-row>
              <el-form-item label="身份证号" margin-left="10px" prop="idCard">
                <el-input v-model="form.idCard" placeholder="请输入患者身份证号" clearable size="small" style="width:200px"></el-input>
              </el-form-item>
              <el-form-item label="患者姓名" margin-left="10px" prop="name">
                <el-input v-model="form.name" placeholder="请输入患者姓名" clearable size="small" style="width:200px"></el-input>
              </el-form-item>
              <el-form-item label="患者电话" margin-left="10px" prop="phone">
                <el-input v-model="form.phone" placeholder="请输入患者电话" clearable size="small" style="width:200px"></el-input>
              </el-form-item>
              <el-form-item label="性别" prop="sex">
                <el-radio-group v-model="form.sex">
                  <el-radio
                    v-for="dict in sexOptions"
                    :key="dict.dictValue"
                    :label="dict.dictValue"
                    :value="dict.dictValue"
                  >{{dict.dictLabel}}</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="出生日期" prop="birthday">
                <div class="block">
                  <el-date-picker
                    v-model="form.birthday"
                    align="center"
                    type="date"
                    placeholder="选择日期"
                    :picker-options="pickerOptions">
                  </el-date-picker>
                </div>
              </el-form-item>
              <el-form-item label="患者年龄" margin-left="50px" prop="age">
                <el-input v-model="form.age" placeholder="请输入患者年龄" clearable size="small" style="width:200px"></el-input>
              </el-form-item>
              <el-form-item label="地址信息" margin-left="50px" prop="address">
                <el-input v-model="form.address" placeholder="请输入地址信息" clearable size="small" style="width:200px"></el-input>
              </el-form-item>
            </el-row>
          </el-form>
        </el-card>
      </el-col>
    </el-row>
    <!--患者信息结束-->
  </div>
</template>

<script>

import {listPatient} from "../../../api/his/doctor";


export default {
  name: "Doctor",
  data() {
    return {
      // 性别
      sexOptions:[],
      // 新增日期标签
      pickerOptions: {
        shortcuts: [{
          text: '今天',
          onClick(picker) {
            picker.$emit('pick', new Date());
          }
        }, {
          text: '昨天',
          onClick(picker) {
            const date = new Date();
            date.setTime(date.getTime() - 3600 * 1000 * 24);
            picker.$emit('pick', date);
          }
        }, {
          text: '一周前',
          onClick(picker) {
            const date = new Date();
            date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
            picker.$emit('pick', date);
          }
        }]
      },
      // 数据字典
      statusOptions: [],
      // queryParams:{
      //   idCard: undefined,
      // },
      form:{
        idCard: undefined,
        // name: undefined,
        // phone: undefined,
        // sex: 2,
        // birthday: undefined,
        // age: undefined,
        // address: undefined
      }
    }
  },
  created() {
    this.getDicts("sys_normal_disable").then(response => {
      this.statusOptions = response.data;
    });
    // 获取性别字典值
    this.getDicts("sys_user_sex").then(response => {
      console.log(response.data);
      this.sexOptions = response.data;
    });
  },
  methods: {
    // getList(){
    //   listPatient()
    // },
    // 字典状态字典翻译
    statusFormat(row, column) {
      return this.selectDictLabel(this.statusOptions, row.status);
    },

    // 根据身份证查询信息
    handleQuery(){
      // console.log(this.queryParams.idCard);
      if(this.form.idCard === undefined){
        this.msgError("请输入身份证号")
        return
      }
      this.loading = true
      listPatient(this.form).then(res=>{
        console.log(this.form.idCard);
        console.log("11111");
        console.log(res.data);
        this.form = res.data[0]
        this.form.age = 30
        this.loading=false
        console.log(this.form);
      }).catch(()=>{
        this.form.sex = 2
        }
      )
    }
  }
}
</script>

<style scoped>

</style>
